export const list = [
  {
    id: '1',
    title: 'CSS选择器的使用',
    name: '刘彬彬',
    content: `
    标签选择器
    id选择器
    class选择器
    属性选择器: 只有在规定了!DOCTYPE时，IE7和IE8才支持属性选择器，在IE6及更低的版本中，不支持属性选择器
    有title属性的元素，文字为红色
    [title]  {
    color: red;
    }
    属性title等于asd的元素，文字为红色
    [title=asd] {
    color: red;
    }
    拥有属性title，且值（多个值以空格分隔）包含asd的元素，文字为红色
    [title~=asd] {
    color: red;
    }
    实例： 以下均为红色
    <p  title="asd">啦啦啦啦</p>
    <p  title="asd  sdhkj">啦啦啦啦</p>
    拥有属性title，且值（值以-连字符连接时）包含asd的元素，文字为红色
    [title |=asd] {
    color: red;
    }
    实例： 以下均为红色
    <p  title="asd">啦啦啦啦</p>
    <p  title="asd-sdhkj">啦啦啦啦</p>
    派生选择器：
    1）后代选择器    h1  span
    2）子元素选择器	h1 > span
    3）相邻兄弟选择器	h1 + h2   h1和h2有相同父级，且h2紧邻h1`,
    time: '2024-02-23 09:16'
  },
  {
    id: '2',
    title: 'CSS样式的使用',
    name: '刘彬彬',
    content: `1）继承样式
    font-family
    font-size
    color (注意a标签有自己的默认颜色)
    
    
    
    
    
    2）非继承样式`,
    time: '2024-02-23 10:34'
  },
  {
    id: '3',
    title: '鼠标事件的使用',
    name: '刘彬彬',
    content: `一、clientX、clientY
    点击位置距离当前body可视区域的x，y坐标
    二、pageX、pageY
    对于整个页面来说，包括了被卷去的body部分的长度
    三、screenX、screenY
    点击位置距离当前电脑屏幕的x，y坐标
    四、offsetX、offsetY
    相对于带有定位的父盒子的x，y坐标
    五、x、y
    和screenX、screenY一样`,
    time: '2024-02-23 11:51'
  },
  {
    id: '4',
    title: 'resize-detector的使用',
    name: '刘彬彬',
    content: `使用示例：
    <div ref="chartDom"  style="height: 400px;"></div>
    import  echarts  from  'echarts'
    import  debounce  from  'lodash/debounce'
    import  {  addListener,  removeListener  }  from  'resize-detector'
    export default {
    mounted () {
    const  dom = this.$refs.chartDom
    this.chart = echarts.init(dom)
    addListener(dom,  this.resize)
    },
    methods: {
    resize: debounce(() => {
    this.chart.resize()
    }, 3000)
    },
    beforeDestory () {
    removeListener(this.$refs.chartsDom, this.size)
    this.chart.dispose()
    this.chart = null
    },
    watch: {
    //  普通监听
    option (val) {
    console.log(val)
    },
    //  深度监听
    option2: {
    handler (val) {
    console.log(val)
    },
    deep: true
    }
    }
    }`,
    time: '2024-02-23 15:20'
  }
]